{% extends "kitchen/dashboard_base.html" %}

{% load compile_static %}
{% load static %}

{% block cssincludes %}
<link href="{% static 'orders.scss'|compile %}" rel="stylesheet" type="text/css" />
{% endblock %}

{% block content %}

<div class="order-controls">
    <a href="{% url 'orders_create' %}" class="btn btn-primary">New Order</a>
</div>

<ol class="orders-list">
    {% for order in orders %}
    <li class="card order" id="order-499394">
        <div class="card-block order-body">
            <h5 class="card-title">
                {{order.party.table.name}} - {{order.party.name}} 
                <span class="text-muted">(#{{order.id}})</span>
            </h5>
            <div class="card-text">
                <ul class="order-item-list">
                    {% for item in order.ordermenuitem_set.all %}
                    <li>{{item.menu_item.name}}
                        {% if item.add_ingredients.count > 0 %}
                        <ul class="order-additions">
                            {% for add_ingredient in item.add_ingredients.all %}
                            <li><span class="order-action-verb">ADD</span> {{add_ingredient.name}}</li>
                            {% endfor %}
                        </ul>
                        {% endif %}
                        {% if item.remove_ingredients.count > 0 %}
                        <ul class="order-removals">
                            {% for remove_ingredient in item.remove_ingredients.all %}
                            <li><span class="order-action-verb">REMOVE</span> {{remove_ingredient.name}}</li>
                            {% endfor %}
                        </ul>
                        {% endif %}
                    </li>
                    {% endfor %}
                </ul>
            </div>
        </div>
        <div class="card-footer">
            <div class="order-controls">
                <a href="{% url "orders_clear" order.id %}" class="btn btn-primary btn-sm">Clear</a>
            </div>
        </div>
    </li>
    {% endfor %}
</ol>

{% endblock %}
